/*
 * @Descripttion: 工具类
 * @Author: 张正兴
 * @Date: 2021-12-27 12:30:16
 * @LastEditors: 张正兴
 */
import * as THREE from "three";
import gsap from "gsap"; // 动画
import { globalSprite } from "../params";

/**
 * @description 空间坐标转屏幕坐标
 * @camera 相机
 * @width height 当前画布的长和宽
 * @coordinate 空间坐标 new THREE.Vector3(0, 0, 0);
 *
 * */
function spaceConversion(camera: any, width: number, height: number, coordinate: any) {
  //  let world_vector = new THREE.Vector3(0, 0, 0);
  let vector = coordinate.project(camera);
  let halfWidth = width / 2,
    halfHeight = height / 2;
  const test = {
    x: Math.round(vector.x * halfWidth + halfWidth),
    y: Math.round(-vector.y * halfHeight + halfHeight),
  };
  return test;
}

// 生成黑白相间canvas
function generateTexture() {
  const canvas = document.createElement("canvas");
  canvas.width = 256;
  canvas.height = 256;

  const context = canvas.getContext("2d");
  const image = context?.getImageData(0, 0, 256, 256);

  let x = 0,
    y = 0;

  if (image) {
    for (let i = 0, j = 0, l = image.data.length; i < l; i += 4, j++) {
      x = j % 256;
      y = x === 0 ? y + 1 : y;
      image.data[i] = 255;
      image.data[i + 1] = 255;
      image.data[i + 2] = 255;
      image.data[i + 3] = Math.floor(x ^ y);
    }
    context?.putImageData(image, 0, 0);
  }

  return canvas;
}

/**
 * event       事件
 * camera      相机
 * mainCanvas  画布dom
 * scene       场景
 * outlinePass 点击物体发光
 */
function initRay(event: any, camera: any, mainCanvas: any, scene: any, outlinePass: any) {
  // 将屏幕坐标转为标准设备坐标(支持画布非全屏的情况)
  let x = ((event.clientX - mainCanvas.getBoundingClientRect().left) / mainCanvas.offsetWidth) * 2 - 1; // 设备横坐标
  let y = -((event.clientY - mainCanvas.getBoundingClientRect().top) / mainCanvas.offsetHeight) * 2 + 1; // 设备纵坐标

  let standardVector = new THREE.Vector3(x, y, 1); // 设备坐标

  // 标准设备坐标转为世界坐标
  let worldVector = standardVector.unproject(camera);

  // 射线投射方向单位向量(worldVector坐标减相机位置坐标)
  let ray = worldVector.sub(camera.position).normalize();

  // 创建射线投射器对象
  let rayCaster = new THREE.Raycaster(camera.position, ray);

  const pointer = new THREE.Vector2();
  pointer.x = x;
  pointer.y = y;
  rayCaster.setFromCamera(pointer, camera);

  // 返回射线选中的对象数组(第二个参数默认值是false，意为是否遍历图形内部的所有子图形)
  let intersects = rayCaster.intersectObjects(scene.children, true);

  if (intersects.length > 0 && intersects[0].object.name != "sprite") {
    // 射线拾取的首个对象
    let currObj: any = intersects[0];

    // 被射线选中的物体发光
    const selects: any[] = [];
    currObj.object.parent.children.forEach((item: any) => {
      if (item.name != "sprite") {
        selects.push(item);
      }
    });
    outlinePass.selectedObjects = selects;

    // 调用组件自定义的click方法
    if (currObj.object.parent?.parent?.onClick) {
      currObj.object.parent.parent.onClick();
    }
    
  } else {
    // 清除选中的标签
    globalSprite.forEach((item: any) => {
      item.visible = false;
    });
    outlinePass.selectedObjects = [];
  }
}

/**
 * 动画调用
 */
function animate() {
  // 动画技术(设置范围动画)
  let demo = { score: 0 };
  gsap.to(demo, {
    score: 50,
    // ease: 'linear',   // 开启则匀速运动
    onUpdate: showScore,
    duration: 5,
  });

  function showScore() {
    // obj.position.set(demo.score, 0, 0)
    console.log("当前变化值", demo.score);
  }
}

export { initRay };
